.home {
    width: 750px;
    background-color: RGB(248, 248, 248);
    padding-bottom: 100px;

    .top {
        height: 100px;
        padding: 0 19px;
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .top-select {
            width: 540px;
        }

        .top-map {
            font-size: 30px;
            color: #333;
            display: flex;
            justify-content: space-around;
            align-items: center;
            img{
                width: 15px;
                height: 13px;
            }
            p{
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
        }
    }

    .category-list {
        margin-top: 61px;
        padding: 0 19px;

        .category-item {

            .item-title {
                font-size: 38px;

            }

            .item-flex {
                margin-top: 36px;
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 44px 10px;

                .item {
                    width: 350px;
                    display: flex;
                    flex-direction: column;
                    text-align: left;
                    img {
                        width: 350px;
                        height: 350px;
                        background-color: #fff;
                    }

                    .item-name {
                        font-size: 26px;
                        color: #333;
                        margin-top: 17px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }

                    .item-price {
                        font-size: 26px;
                        color: #9E4242;
                        margin-top: 5px;
                    }
                }

                .last-item {
                    width: 350px;
                    height: 350px;
                    background-color: #fff;
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    p {
                        font-size: 32px;
                    }

                    img {
                        width: 58px;
                        height: 58px;
                        margin-top: 21px;
                    }
                }

            }
        }
    }

    .topic {
        height: 626px;
        margin-top: 20px;
        background-color: #fff;
        padding: 0 19px;

        .topic-title {
            font-size: 38px;
            color: #333;
            padding-top: 41px;
            padding-bottom: 36px;
        }

        .topic-item {

            width: 712px;
            height: 422px;
            white-space: nowrap;
            overflow-y: auto;


            .topic-card {
                width: 556px;
                height: 422px;
                margin-right: 20px;
                display: inline-block;

                img {
                    width: 556px;
                    height: 309px;
                }

                .topic-card-tp {
                    width: 100%;
                    display: flex;
                    justify-content: space-between;
                    align-items: center;
                    margin-top: 21px;

                    .topic-card-title {
                        width: 330px;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        font-size: 30px;
                        color: #333;
                    }

                    .topic-card-price {
                        font-size: 24px;
                        color: #9E4242;
                    }
                }


                .topic-card-subtitle {
                    width: 216px;
                    margin-top: 12px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    font-size: 24px;
                    color: #999;
                    text-align: left;
                }
            }
        }
    }

    .productlist {
        background-color: #fff;
        width: 750px;
        height: 410px;
        padding: 40px 0px;
        white-space: nowrap;
        overflow-y: auto;

        .list-item {
            width: 296px;
            height: 408px;
            display: inline-block;
            border-right: 0.8px solid rgba(151, 151, 151, .2);

            img {
                width: 254px;
            }

            .productlist-info {
                width: 200px;
                margin-left: 50px;
                text-align: left;

                .productlist-name {
                    font-size: 30px;
                    color: #333;
                    text-align: left;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    margin-top: 0px;
                    margin-bottom: 0px;
                }

                .productlist-brief {
                    font-size: 24px;
                    color: #999;
                    overflow: hidden;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    margin-top: 0px;
                    margin-bottom: 0px;
                }

                .productlist-price {
                    font-size: 24px;
                    color: #9E4242;
                    margin-top: 12px;
                }
            }
        }

    }

    .new,
    .hot {
        width: 710px;
        height: 242px;
        margin: 20px;

        img {
            width: 100%;
        }
    }

    .swipe-item {
        padding: 22px 19px 0 19px;

        .banner {
            width: 710px;
        }
    }

    .homechannel {
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: #fff;
        padding: 47px 48px 50px 48px;

        li {
            display: flex;
            flex-direction: column;
            justify-content: space-between;

            img {
                width: 69px;
            }

            span {
                font-size: 26px;
            }
        }
    }

    .brandList {
        height: 570px;
        background-color: #fff;
        margin-top: 19px;
        padding: 0 19px;

        .brandList-title {
            font-size: 38px;
            text-align: center;
            padding-top: 41px;
            padding-bottom: 33px;
        }

        .info {
            height: 408px;
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap;
            align-content: space-between;

            .info-item {
                position: relative;

                .info-mes {
                    position: absolute;
                    top: 33px;
                    left: 23px;
                    text-align: left;

                    .name {
                        font-size: 30px;
                        font-weight: 500;
                    }

                    .price {
                        font-size: 24px;
                        color: #999;
                    }
                }

                img {
                    width: 350px;
                    height: 196px;
                }
            }
        }


    }
}